<template>
	<view class="news-list-wrap-item d-flex flex-column border-bottom p-3 j-sb" style="height: auto;" @tap="skipToNewsDetail">
		<view style="position: relative;">
			<image :src="item.thumb" mode="" style="height: 368rpx;width: 690rpx;"></image>
			<image src="../../static/images/videoFlag.png" class="video-flag-pos" mode=""></image>
			<image src="../../static/images/video.png" class="stop-img" style="width: 64rpx;height: 64rpx;" mode=""></image>
		</view>
		<text style="font-size: 32rpx;line-height: 1.4;">{{ item.title.substring(0, 40) }}</text>
		<view class="d-flex a-center font-24" style="color: #CCCCCC;">
			<text class="mr-2" style="font-size:12px">{{ item.origin }}</text>
			<text class="mr-2" style="font-size:12px">{{ item.releaseDataDes }}</text>
			<!-- <text class="iconfont icon-comment1 mr-1" style="font-size: 24upx;"></text>
			<text>{{ item.commentCount }}</text> -->	
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			item: {
				type: Object,
				default: () => {
					return {};
				}
			}
		},
		methods: {
			skipToNewsDetail() {
				console.log(this.item);
				const newsId = this.item.contentId;
				const url = this.item.url;
                const thumb = this.item.thumb;
                const title = this.item.title;
				uni.navigateTo({
					url: '/pages/index/news-detail/news-detail?id=' + newsId + "&thumb=" + thumb + "&title=" + title + '&type=1&link=' + url
				});
				//加入历史记录
				let list = uni.getStorageSync('history')
				list = list ? JSON.parse(list) : [];
				let index = list.findIndex(v=>v.contentId === newsId)
				if(list.length >= 50){
					list.pop()
				}
				if(index === -1){
					 list.unshift(this.item);
				     uni.setStorageSync('history',JSON.stringify(list))
				}else{
					for (var i = 0; i < list.length; i++) {
					            if (list[i].contentId === newsId) {
					                list.splice(i, 1); // 如果数据组存在该元素，则把该元素删除
					                break;
					            }
						}
					list.unshift(this.item);
					uni.setStorageSync('history',JSON.stringify(list))
				}
			}
		}
	};
</script>

<style scoped>
	.image-list {
		width: 300rpx;
		height: 171rpx;
	}

	.news-list-wrap-item {
		height: 171rpx;
	}

	.video-flag-pos {
		position: absolute;
		top: 20upx;
		right: 20upx;
		width: 110upx;
		height: 30upx;
	}

	.video-flag {
		left: 50%;
		top: 50%;
		position: absolute;
		font-size: 64upx;
		margin-left: -32upx;
		margin-top: -58upx;
	}
	.stop-img{
		position: absolute;
		top: 152upx;
		left: 313upx;
	}
</style>
